<template>
	<view class="comment_list">
		<image src="../../../static/icons/comment.png" class="comment_icon"></image>
		<h class="comment_title"> 精彩评论</h>
		<image src="../../../static/icons/comment_write.png" class="comment_write" @click="addComment"></image>
		<view class="comment_item" v-for="item in comments">
			<view class="user_field"> 
				<view class="user_avatar">
					<image :src="item.user.avatarUrl"class="avatar_image"></image>
				</view>
				<i class="user_name">{{item.user.name}}</i>
			</view>
			<view class="comment_content">
				<p>{{item.content}}</p>
			</view>
			<view class="comment_date">
				
			</view>
			<view class="comment_praise">
				<praise :praiseNum="item.praiseNumber"></praise>
			</view>
		</view>
		
	</view>
</template>

<script>
	import praise from "../../../components/praise.vue"
	export default {
		props:["comments","type","fid","uid"],
		components:{
			praise
		},
		data(){
			return{				
				
			}
		},
		methods:{
			addComment(){
				uni.navigateTo({
					url:'/pages/comment/user-comment/comment-add?type='+this.type+'&fid='+this.fid+'&uid='+this.uid
				})				
			},
			dealText(){
				this.comments.forEach(item=>{
					
				})
			}
		}
	}
</script>

<style lang="less">
	.comment_list{
		.comment_icon{
			width:50rpx;
			height:50rpx;
			float: left;
			margin-right:10px;
			margin-left:5px;
		}
		.comment_write{
			width:50rpx;
			height:50rpx;
			float: right;
			margin-right:10px;
		}
		.comment_title{
			font-weight: 550;
			line-height: 25px;
		}
		
	}
	.comment_item{
		border-bottom: 1rpx solid #DCDFE6;
		background-color: #fff;
		margin-top:10px;
		padding-left: 10px;
		padding-right: 10px;
		overflow: hidden;
		.user_field{
			float:left;
			width:100%;
			height:32px;
			.user_avatar{
				border:1px solid #eee;
				border-radius:50%;
				height:32px;
				width:32px;
				margin-top:5rpx;
				margin-left: 8px;
				margin-right: 8px;
				float: left;
				.avatar_image{
					height: 100%;
					width:100%;
					border-radius:50%;
					background-color: #eee;
				}
			}
			.user_name{
				font-size: 14px;
				line-height: 32px;
			}
		}
		.comment_content{
			margin-top:15px;
			margin-bottom: 10px;
			margin-left:8px;
			min-height:80px;
			width:100%;
			p{
				display: inline-block;
				padding-top:10px;
			}
		}
		.comment_date{
			font-size: 12px;
			float:left;
			margin-left:8px;
			color: #808080;
			
		}
		.comment_praise{
			float:right;
		}
	}
</style>
